<template>
  <div class="value-add-list" v-if="toolsLists.length">
    <h2 class="toolsTitle">增值功能</h2>
    <a-row v-for="(item, index) in toolsLists" :key="index">
      <a-col :span="9">
        <div class="toolItem">
          <span>{{ item.productName }}</span>

          <span class="spanTitle"> {{ item.serviceFee }}</span>
          <span>
            {{ item.productCode === "withdraw.fee" ? "元/笔" : "%" }}</span
          >
        </div>
      </a-col>
      <a-col :span="9">
        <div class="toolItem">
          <span>{{ item.productName }} 成本</span>

          <span class="spanTitle"> {{ item.serviceFeeCost }}</span>

          <span>
            {{ item.productCode === "withdraw.fee" ? "元/笔" : "%" }}</span
          >
        </div>
      </a-col>
    </a-row>
    <div></div>
  </div>
</template>

<script>
export default {
  props: {
    memberNo: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      toolsLists: [
      ],
    };
  },

  mounted() {
  
    this.getValueAddedFee();
  },

  methods: {
    getValueAddedFee() {
      var data = {
        memberNo: this.memberNo,
      };
      this.$axios.post("/agent/added/value/fetch", data).then((res) => {
      
        if (res.data.code === "OK") {
            this.toolsLists = res.data.list
        } else {
           this.toolsLists = []
          
        }
      });
    },
  },
};
</script>


<style lang="less" scoped>
.toolsTitle {
  margin: 15px 0;
  font-weight: 600;
  font-size: 16px;
}
.spanTitle {
  margin: 0 15px;
  font-weight: 600;
}

.toolItem {
  margin: 5px;
}
</style>